
<div class='docs-toc'>
  <table class='docs-toc__table'>
    <tr>
      <td>
        {% for child_group in page.child_groups %}

          {% comment %}
            Manually create column breaks
          {% endcomment %}
          {% if page.version.id == 'v4' %}
            {% if child_group.title == 'Date & Time'
              or child_group.title == 'Events'
              or child_group.title == 'Resources'
            %}
              </td><td>
            {% endif %}
          {% elsif page.version.id == 'v3' %}
            {% if child_group.title == 'Date & Time'
              or child_group.title == 'Events'
              or child_group.title == 'Resources'
            %}
              </td><td>
            {% endif %}
          {% elsif page.version.id == 'v1' %}
            {% if child_group.title == 'Date & Time'
              or child_group.title == 'Events'
              or child_group.title == 'International'
            %}
              </td><td>
            {% endif %}
          {% endif %}

          <h2 class='docs-toc__title'>{{ child_group.title | escape }}</h2>

          {% for article in child_group.children %}
            <div class='docs-toc-card'>

              <div class='docs-toc-card__head'>
                <a class='docs-toc-card__head-link'
                  href='{{ site.baseurl }}{{ article.url | escape }}'
                  >
                  {{ article.title | escape }}
                </a>
                {% if article.is_premium %}
                  <a class='badge' href='{{ site.baseurl }}/purchase'>
                    Premium
                  </a>
              {% endif %}
              </div>

              {% if article.own_child_groups %}
                <div class='docs-toc-card__body'>
                  <ul>
                    {% for article_child_group in article.own_child_groups %}
                      {% if article_child_group.title %}
                        <li>
                          {{ article_child_group.title | escape }}
                          <ul>
                      {% endif %}
                      {% for subarticle in article_child_group.children %}
                        <li>
                          <a href='{{ site.baseurl }}{{ subarticle.url | escape }}'>
                            {{ subarticle.title | escape }}
                          </a>
                        </li>
                      {% endfor %}
                      {% if article_child_group.title %}
                          </ul>
                        </li>
                      {% endif %}
                    {% endfor %}
                  </ul>
                </div>
              {% endif %}

            </div>
          {% endfor %}

        {% endfor %}
      </td>
    </tr>
  </table>
</div>
